<template>
  <router-link :to="url">
    <b-button :variant="color" size="sm" v-text="text" style="margin-top: 5px;margin-left: 5px; margin-right: 5px"></b-button>
  </router-link>
</template>

<script>
let dataMap = new Map([
  [0, 'primary'],
  [1, 'secondary'],
  [2, 'success'],
  [3, 'danger'],
  [4, 'info'],
  [5, 'light'],
  [6, 'dark']
])
  import {BButton} from 'bootstrap-vue'
  export default {
    name: "tag",
    data() {
      return {
        dataMap
      }
    },
    computed: {
      color() {
        let random = Math.floor(Math.random()*7);
        return this.dataMap.get(random);
      }
    },
    props: {
      url: {
        type: String,
        default: '/'
      },
      text: String
    },
    components: {
      BButton
    }
  }
</script>

<style scoped>

</style>
